<template>

  <div class="content-box">
    <nav-title title="离职审批"/>
    <div class="regulations-box">
      <div class="title">基本信息</div>
      <v-wastage-info v-bind:baseInfo="baseInfo"></v-wastage-info>
    </div>
    <div class="regulations-box">
      <div class="title">详细信息</div>
      <simple-line title="离职日期" v-bind:value="baseInfo.cLzAppDt"/>
      <simple-line title="离职原因说明" v-bind:value="baseInfo.terReason"/>
      <simple-line v-if="baseInfo.terReason=='其他'" title="其他原因说明" v-bind:value="baseInfo.comments256"/>
      <simple-line title="离职交接信息备注" v-bind:value="baseInfo.cOtherExplain"/>
    </div>

    <!-- 流程信息 -->
    <div class="regulations-box">
<!--      <div class="title">流程信息</div>
      <edit-option-line label="签署竞业协议" :vals="ynVal" :readonly="true" :showValue="baseInfo.yn4 ? '是' : '否'" :boldtitle="true" v-model="baseInfo.yn4"></edit-option-line>
      <edit-option-line label="关键岗位" :vals="ynVal" :showValue="baseInfo.yn4 ? '是' : '否'" :boldtitle="true" v-model="baseInfo.yn4"></edit-option-line>
      <edit-option-line label="存在借款" :vals="ynVal" :readonly="true" :showValue="baseInfo.yn4 ? '是' : '否'" :boldtitle="true" v-model="baseInfo.yn4"></edit-option-line>
      <edit-option-line label="优化备案人员" :vals="ynVal" :readonly="true" :showValue="baseInfo.yn4 ? '是' : '否'" :boldtitle="true" v-model="baseInfo.yn4"></edit-option-line>
      <edit-date-line label="离职日期" :important="true" :boldtitle="true" v-model="baseInfo.terminationDt"></edit-date-line>
      <edit-option-line label="离职原因" :important="true" :vals="reasonList" showValue="离职原因" :boldtitle="true" v-model="baseInfo.reason"></edit-option-line>
      <edit-option-line label="离职详细原因" :important="true" :vals="detailReasonList" showValue="离职原因" :boldtitle="true" v-model="baseInfo.detailReason"></edit-option-line>
 -->
      <file-line label="附件" :important="true" :fileitems="baseInfo.wfFiles" :boldtitle="true"/>
    </div>
    <div class="regulations-box">
      <div class="title">分权引用</div>
      <fqyy-line :editting="false" :fqyyFlag="fqyyInfo.cFqyyFlag" :noFqyySum="fqyyInfo.noFqyySum" :noFqyyRatio="fqyyInfo.noFqyyRatio" :fqyyMsg="fqyyInfo.cFqyyDetail" ref="fqyy"></fqyy-line>
    </div>
    <!-- 流程图 -->
    <div class="regulations-box">
      <div class="title">流程图</div>
      <v-flow-charts :transNum="cTransactionNbr"></v-flow-charts>
    </div>

    <!-- 审批意见 -->
    <div class="regulations-box"  v-if="approved == '0'&&baseInfo.cStepType!='C'">
      <div class="info-label">审批意见</div>
      <div class="info-label-text">
        <textarea placeholder="请在这里输入..." rows="5" v-model="cComments"></textarea>
      </div>
    </div>

    <!-- 底部按钮 -->
    <div style="height: 50px"></div>
    <!-- 底部按钮 -->
    <div v-if="approved == '0'">
         <operation-btn
        :cApprovalSw="baseInfo.cApprovalSw" :cDenySw="baseInfo.cDenySw"
        :cPushbackAllSw="baseInfo.cPushbackAllSw" :cAddSw="baseInfo.cAddSw"
        :cTransactionNbr="baseInfo.cTransactionNbr" :cWfType="baseInfo.cWfType"
        :cReadSw="baseInfo.cIsChuanyue" :cStepType="baseInfo.cStepType"
        :cComments="cComments" :approveBizType="'wastage'"
        ></operation-btn>
    </div>
  </div>

</template>

<script>
import fqyyLine from "../../components/basic/FqyyLine"
import { Selector, Group,dateFormat } from "vux";
import {getWastage,getWastageReason,getCompensateProcess,getWastageDetailReason, getWastageApprove, getFqyyInfo} from "../../api/api";
import SimpleLine from '../../components/basic/SimpleLine'
import EditDateLine from '../../components/basic/EditDateLine'
import EditOptionLine from '../../components/basic/EditOptionLine'
import FileLine from '../../components/basic/FileLine'
import vWastageInfo from "../formalStaff/wastageInfo";
import operationBtn from "./common/operationBtn";
import vWastageDetail from "../formalStaff/wastageDetail";
import vFlowCharts from "../formalStaff/common/flowChart";
import { json2Form,publicUrl } from "../../util/http";
import CommonUtil from '../../components/basic/util'

export default {
  components: {
    vWastageInfo,
    vWastageDetail,
    Selector,
    Group,
    vFlowCharts,
    SimpleLine,
    EditOptionLine,
    EditDateLine,
    FileLine,
    operationBtn,
    fqyyLine
  },
  created() {
    this.cTransactionNbr = this.$route.query.cTransactionNbr;
    this.stepNbr = this.$route.query.stepNbr;
    window.onclick = this.hideGroup;
    //离职审批信息
    this.getWastageInfo();
    //获取字典表信息
    this.getDic();
  },
  mounted() {},
  data() {
    return {
      fqyyInfo:{
        fqyyFlag:'',
        fqyyDetail:''
      },
      approved:'0',
      baseInfo: {},
      ynVal:[{ value: "是", key: "Y" }, { value: "否", key: "N" }],


      reasonList: [],
      detailReasonList: [],

      //按钮点击的参数
      cTransactionNbr: this.$route.query.cTransactionNbr,
      cComments: "",

    };
  },
  methods: {
    getDic() {
      //离职原因字典
      getWastageReason({ setId: "XC001"})
        .then(res => {
          this.reasonList = [];
          if (res && res.retCode === "000000") {
            for (let i = 0; i < res.retData.length; i++) {
              this.reasonList.push({
                value: res.retData[i].descr,
                key: res.retData[i].actionReson
              });
            }
          }
        })
        .catch(res => {});
    },
    getDetailReason() {
      //离职详细原因字典
      getWastageDetailReason({ actionReason: this.reason })
        .then(res => {
          this.detailReasonList = [];
          if (res && res.retCode === "000000") {
            for (let i = 0; i < res.retData.length; i++) {
              this.detailReasonList.push({
                value: res.retData[i].descr,
                key: res.retData[i].rsTerDetail
              });
            }
          }
        })
        .catch(res => {});
    },
    getWastageInfo() {
      this.$vux.loading.show();
      let params = {
        cTransactionNbr: this.cTransactionNbr,
        stepNbr: this.stepNbr
      };
      getWastage(params)
        .then(res => {
          this.$vux.loading.hide();
          if (res && res.retCode === "000000") {

            getFqyyInfo({'cTransactionNbr':this.cTransactionNbr,'processType':'wastage'}).then(res => {
                this.fqyyInfo = res.retData;
            })

            this.baseInfo = res.retData
            console.log(this.baseInfo);

            this.baseInfo.cLzAppDt = dateFormat(
              res.retData.cLzAppDt,
              "YYYY-MM-DD"
            );
            CommonUtil.updateFileUrl(this.baseInfo.wfFiles);
            this.baseInfo.terminationDt = dateFormat(
              res.retData.terminationDt,
              "YYYY-MM-DD"
            );
            let auths = res.retData.authFileds;
            // for(var i=0;i<auths.length;i++) {
            //   this.displayVal[auths[i].fieldKey] = auths[i].isDisplay
            //   this.editVal[auths[i].fieldKey] = auths[i].isEdit
            // }
          } else {
            this.$vux.alert.show({
              title: "提示",
              content: res.retMsg
            });
          }
        })
        .catch(res => {
          this.$vux.loading.hide();
          console.error(res)
          this.$vux.alert.show({
            title: "警告",
            content: "网络异常，请稍后重试"
          });
        });
    },
  }
};
</script>
<style type="text/scss" lang="scss">
@import "../../styles/staff.scss";
.reject-main {
  position: relative;
  .reject-group {
    position: absolute;
    top: -80px;
    left: 0px;
    button {
      margin-bottom: 1px;
    }
  }
}
.slide-fade-enter-active {
  transition: all 0.1s ease;
}
.slide-fade-leave-active {
  transition: all 0.2s cubic-bezier(1, 0.5, 0.8, 1);
}
.slide-fade-enter, .slide-fade-leave-to
/* .slide-fade-leave-active for below version 2.1.8 */ {
  transform: translateY(10px);
  opacity: 0;
}
</style>
